﻿@{
    Layout = "~/Views/Shared/Main.cshtml";
}
@section  PageStyleFile{
	<link rel="stylesheet" type="text/css" href="~/assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.css" />
	<link rel="stylesheet" type="text/css" href="~/assets/global/plugins/jquery-multi-select/css/multi-select.css"/>
	<link rel="stylesheet" type="text/css" href="~/assets/admin/pages/css/grouplist.css"/>
	<link rel="stylesheet" type="text/css" href="~/assets/admin/pages/css/groupdetail.css"/>
}

@section PageScriptFile{
	<script type="text/javascript" src="~/assets/global/plugins/jquery-validation/js/jquery.validate.min.js"></script>
	<script type="text/javascript" src="~/assets/global/plugins/jquery-validation/js/additional-methods.min.js"></script>
	<script type="text/javascript" src="~/assets/global/plugins/jquery-multi-select/js/jquery.multi-select.js"></script>
    <script type="text/javascript" src="~/assets/admin/pages/scripts/grouplist.js"></script>
	<script type="text/javascript" src="~/assets/admin/pages/scripts/groupdetail.js"></script>
}

@section PageScript{
	<script type="text/javascript">
		jQuery(document).ready(function () {
			GroupList.init();
		});
	</script>
}
<div class="col-md-12">
    <div class="portlet light">
        <div class="table-toolbar">
            <div class="row">
                <div class="col-md-9">
                    <form class="form-inline" role="form">
                        <div class="btn-group">
                            <button id="btnOperation" type="button" class="btn blue dropdown-toggle" data-toggle="dropdown">
                                操作 <i class="fa fa-angle-down"></i>
                            </button>
                            <ul class="dropdown-menu" role="menu" aria-labelledby="btnOperation">
								<li>
                                    <a href="#append_to_groups_panel" data-toggle="modal"><i class="fa fa-share-alt"></i> 添加成员 </a>
                                </li>
                                <li class="divider"></li>
                                <li>
                                    <a href="#delete_groups_panel" data-toggle="modal"><i class="fa fa-remove"></i> 删除分组 </a>
                                </li>
                            </ul>
                        </div>
                        <div class="btn-group">
                            <a id="new_user" href="#new_group_panel" data-toggle="modal" class="btn green">
                                添加分组 <i class="fa fa-plus"></i>
                            </a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
		<div id="table_content" class="panel-relative">
			@Html.Partial("GroupTable")
		</div>
    </div>
</div>

<!--删除分组-->
<div class="modal fade bs-modal-sm" id="delete_groups_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">删除分组</h4>
			</div>
			<div class="modal-body">
				<form id="deleteGroupForm" trigger-id="btnDeleteConfirm" role="form" action="~/user/DeleteGroup" method="post">
					<div class="alert alert-warning">
						被删除的分组将无法恢复，请慎重选择！
					</div>
					<div class="input-icon">
						<i class="fa fa-key"></i>
						<input name="_hidden" type="password" class="hide">
						<input id="txtConfirmpwd" name="confirmpwd" type="password" class="form-control" placeholder="需要确认您的登陆密码">
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button id="btnDeleteCancel" type="button" class="btn default" data-dismiss="modal">取消</button>
				<button id="btnDeleteConfirm" type="button" class="btn blue">删除分组</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>

<!--添加成员-->
<div class="modal fade bs-modal-lg" id="append_to_groups_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">添加成员</h4>
			</div>
			<div class="modal-body">
				<form id="appendToGroupForm" role="form" action="~/user/JoinToGroup" method="post">
					<div class="alert alert-success">
						请选择要添加进组的用户
					</div>
					<ul id="user-list" class="user-list clearfix">
						@foreach(TBM.Models.User item in ViewBag.Users){
						<li class="clearfix">
							<div class="pull-left user-avatar"><img src="@(String.IsNullOrEmpty(item.PicUrl) ? "/assets/img/avatar.png" : item.PicUrl + "small.png")" width="30" /></div>
							<div class="pull-left user-list-text">
								<p>@(item.CNName ? item.FirstName + item.LastName : item.LastName + " " + item.FirstName)</p>
								<p>(@item.UID)</p>
							</div>
							<div class="user-list-checkbox">
								<input type="checkbox" name="uids" value="@item.UID">
							</div>
						</li>
						}
					</ul>
				</form>
			</div>
			<div class="modal-footer">
				<button id="btnAppendToGroupCancel" type="button" class="btn default" data-dismiss="modal">取消</button>
				<button id="btnAppendToGroup" type="button" class="btn blue">执行</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>

<!--创建分组表单-->
<div class="modal fade" id="new_group_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header portlet light">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">
					<div class="caption font-red-sunglo">
						<span class="caption-subject bold uppercase">创建分组</span>
					</div>
				</h4>
			</div>
			<div class="modal-body portlet light">
				<div class="form">
					<form id="addGroupForm" role="form" class="form-horizontal" action="~/user/AddGroup" method="post">
						<div class="form-body">
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">* 组ID</label>
								<div class="col-md-10">
									<input name="gid" type="text" autocomplete="off" class="form-control" placeholder="组ID">
									<div class="form-control-focus">
									</div>
									<span class="help-block">不可重复，需以"_"为首字符，请使用字母数字及下划线组成，字符数3-15</span>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">* 组名</label>
								<div class="col-md-10">
									<input type="text" name="groupname" class="form-control" placeholder="组名">
									<div class="form-control-focus">
									</div>
									<span class="help-block">组名，限定10个字符</span>
								</div>
							</div>	
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">描述</label>
								<div class="col-md-10">
									<textarea id="txtMemo" name="descr" class="form-control" rows="2" placeholder="描述"></textarea>
									<div class="form-control-focus">
									</div>
									<span class="help-block">关于组的描述，限定30个字符</span>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>
			<div class="modal-footer">
				<button id="btnCancel" type="button" class="btn default" data-dismiss="modal">取消创建</button>
				<button id="btnCreate" type="button" class="btn blue" data-dismiss="modal">创建分组</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div><!--分组详情页-->
<div class="modal fade bs-modal-lg" id="group_detail_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div id="group_detail_panel_body" class="modal-body"></div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>